//------食物-----------
let food = document.getElementById("food");
food.style.top = "100px";
food.style.left = "100px";
// 食物的坐标
let foodTop = 0;
let foodLeft = 0;
// 1500*857
function setFood() {
  foodTop = Math.ceil(Math.random() * 817);
  foodLeft = Math.ceil(Math.random() * 1460);
  food.style.left = foodLeft + "px";
  food.style.top = foodTop + "px";
}

//--------运动体----------
let dom = document.getElementById("main");
dom.style.top = "0";
dom.style.left = "0";
let domSize = 150;
dom.style.height = domSize + "px";
dom.style.width = domSize + "px";
let topFlag = true;
let leftFlag = true;
let interKey = "";

function move() {
  let top = Math.floor(Math.random() * 70) + 30;
  let left = Math.floor(Math.random() * 70) + 30;
  topFlag = Math.random() > 0.5;
  leftFlag = Math.random() > 0.5;
  //   向下移动
  if (topFlag) {
    //   触及边界，转换方向
    if (parseInt(dom.style.top) + top > 735) {
      dom.style.top = parseInt(dom.style.top) - top + "px";
      // 正常移动
    } else {
      dom.style.top = parseInt(dom.style.top) + top + "px";
    }
    // 向上移动
  } else {
    //   触及边界，转换方向
    if (parseInt(dom.style.top) - top < 0) {
      dom.style.top = parseInt(dom.style.top) + top + "px";
      // 正常移动
    } else {
      dom.style.top = parseInt(dom.style.top) - top + "px";
    }
  }
  //   向右移动
  if (leftFlag) {
    //   触及边界，转换方向
    if (parseInt(dom.style.left) + left > 1375) {
      dom.style.left = parseInt(dom.style.left) - left + "px";
      // 正常移动
    } else {
      dom.style.left = parseInt(dom.style.left) + left + "px";
    }
    // 向左移动
  } else {
    //   触及边界，转换方向
    if (parseInt(dom.style.left) - left < 0) {
      dom.style.left = parseInt(dom.style.left) + left + "px";
      // 正常移动
    } else {
      dom.style.left = parseInt(dom.style.left) - left + "px";
    }
  }
}

function play() {
  interKey = setInterval(() => {
    move();
    let flag1 =
      parseInt(dom.style.left) <= foodLeft + 40 &&
      parseInt(dom.style.left) + domSize >= foodLeft;
    let flag2 =
      parseInt(dom.style.top) <= foodTop + 40 &&
      parseInt(dom.style.top) + domSize >= foodTop;
    // console.log(flag1, flag2);
    if (flag1 && flag2) {
      setFood();
      domSize = domSize - 10;
      dom.style.height = domSize + "px";
      dom.style.width = domSize + "px";
    }
  }, 2000);
}
// dom.onmouseover = () => {
//   clearInterval(interKey);
// };
dom.onmouseout = () => {
  dom.children[0].alt = dom.style.height;
  //   play();
};
setFood();
play();

// function move() {
//   let top = Math.floor(Math.random() * 70) + 30;
//   let left = Math.floor(Math.random() * 70) + 30;
//   //   向下移动
//   if (topFlag) {
//     //   触及边界，转换方向
//     if (parseInt(dom.style.top) + top > 735) {
//       topFlag = false;
//       dom.style.top = "735px";
//       // 正常移动
//     } else {
//       dom.style.top = parseInt(dom.style.top) + top + "px";
//     }
//     // 向上移动
//   } else {
//     //   触及边界，转换方向
//     if (parseInt(dom.style.top) - top < 0) {
//       topFlag = true;
//       dom.style.top = parseInt(dom.style.top) + top + "px";
//       // 正常移动
//     } else {
//       dom.style.top = parseInt(dom.style.top) - top + "px";
//     }
//   }
//   //   向右移动
//   if (leftFlag) {
//     //   触及边界，转换方向
//     if (parseInt(dom.style.left) + left > 1375) {
//       leftFlag = false;
//       dom.style.left = "1375px";
//       // 正常移动
//     } else {
//       dom.style.left = parseInt(dom.style.left) + left + "px";
//     }
//     // 向左移动
//   } else {
//     //   触及边界，转换方向
//     if (parseInt(dom.style.left) - left < 0) {
//       leftFlag = true;
//       dom.style.left = parseInt(dom.style.left) + left + "px";
//       // 正常移动
//     } else {
//       dom.style.left = parseInt(dom.style.left) - left + "px";
//     }
//   }
// }
